<!DOCTYPE html>

<!--[if IE 8]> <html lang="en" class="ie8"> <![endif]-->

<!--[if IE 9]> <html lang="en" class="ie9"> <![endif]-->

<!--[if !IE]><!-->
<html lang="en">
	<!--<![endif]-->

	<!-- BEGIN HEAD -->

	<head>

		<meta charset="utf-8" />

		<title>工作台</title>

		<!-- IE -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<!-- 设置 viewport -->
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<!-- 兼容国产浏览器的高速模式 -->
		<meta name="renderer" content="webkit">
		<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->

		<!-- BEGIN 全局样式 -->
			<!--重置样式-->
		<link rel="stylesheet" type="text/css" href="../../css/reset.css"/>
		<link href="../../lib/bootstrap-3.3.7-dist/css/bootstrap.css" rel="stylesheet" type="text/css" />
			<!--公共样式-->
		<link rel="stylesheet" type="text/css" href="../../css/common.css" />
			<!--app公共面板小组件样式-->
	    <link href="../../css/style.css" rel="stylesheet" type="text/css" />
	    <!--<link href="css/default.css" rel="stylesheet" type="text/css" id="style_color" />-->
	    <link rel="stylesheet" type="text/css" href="../../lib/bootstrap-table/src/bootstrap-table.css"/>
		<!-- END 全局样式 -->

		<style type="text/css">
			.echartBox,.tableBox{
				height: 400px;
			}
			.checkbox-inline,.radio-inline{
				line-height: 21px;
			}
			.portlet-title{
				cursor: move;
			}
			.numbox{
				height: 33%;
				background: #ddd;
				margin: 5px;
				padding: 1.5em 0;
			}
			.state-type{
				position: absolute !important;
				right: 3% !important;
				top:30% !important;
			}
			.proportion{
				position: relative;
				/*padding: 1.5em 0;*/
			} 
			.h2-count{
				font-size: 4em;
				margin:0;
			}
			.h4-count{
				font-size: 2em;
				margin: 0;
			}
			.tableBox{
				overflow: auto;
			}
			
			div#layoutContainer>div{
				min-width: 579px !important;
			}
			
			@media only screen and (min-width: 1440px) and (max-width: 1920px) {
				div#layoutContainer>div{
					min-width: 730px !important;
				}
			}
			@media only screen and (min-width: 1366px) and (max-width: 1440px) {
				div#layoutContainer>div{
					min-width: 616px !important;
				}
				.h2-count{
					font-size: 3.5em;
				}
				.h4-count {
				    font-size: 1.75em;
				    margin: 0;
				}
				#layoutContainer{
				    margin-bottom: 60px;
    				overflow: auto;
				}
			}
			@media only screen and (min-width: 1024px) and (max-width: 1366px) {
				div#layoutContainer>div{
					min-width: 579px !important;
				}
				.h2-count{
					font-size: 3em;
				}
				.h4-count {
				    font-size: 1.5em;
				    margin: 0;
				}
				#layoutContainer{
				    margin-bottom: 200px;
    				overflow: auto;
				}
			}
			.label{
				font-size: 1.2em;
			}
			body{
				height: auto !important;
			}
		</style>
		
	</head>

	<!-- END HEAD -->

	<!-- BEGIN BODY -->

	<body class="">
		<div class="container-fluid pd-10">
			<!--布局配置sss-->
			<div class="mb-10">
				<button type="button" class="btn btn-success btn-cofing">布局配置</button>
				
				<div class="modal fade" tabindex="-1" role="dialog" id="layoutOption">
				  <div class="modal-dialog" role="document">
				  	<form action="#" id="diyForm">
				    <div class="modal-content">
				      <div class="modal-header">
				        <button type="button" class="close" data-dismiss="modal" aria-label="Close"></button>
				        <h4 class="modal-title">个性化定制</h4>
				      </div>
				      <div class="modal-body">
				      		<div id="Diy">
				      			<div id="layoutBox" class="mg-10">
					      	 		<b>布局选择：</b>
					      	 		<label class="radio-inline " for="layout_1">
									  <input type="radio" name="layout" id="layout_1" value="col-sm-4">三列排版
									</label>
									<label class="radio-inline" for="layout_2">
									  <input type="radio" name="layout" id="layout_2" value="col-sm-6" checked="checked">双列排版
									</label>
									<label class="radio-inline " for="layout_3">
									  <input type="radio" name="layout" id="layout_3" value="col-sm-12">单列排版
									</label>
					      	 	</div>
					      	 	
					      	 	<div id="moduleBox" class="mg-10">
					      	 		<b>功能配置：</b>
					      	 		<label class="checkbox-inline" for="module_1">
									  <input type="checkbox" id="module_1" value="beLateBox" name="module" checked>迟到数据
									</label>
									<label class="checkbox-inline" for="module_2">
									  <input type="checkbox" id="module_2" value="leaveEarlyBox" name="module" checked>早退数据
									</label>
									<label class="checkbox-inline" for="module_3">
									  <input type="checkbox" id="module_3" value="absenteeismBox" name="module" checked>旷工数据
									</label>
									<label class="checkbox-inline" for="module_4">
									  <input type="checkbox" id="module_4" value="onSchoolBox" name="module" checked>到校数据
									</label>
									<label class="checkbox-inline" for="module_5">
									  <input type="checkbox" id="module_5" value="noOnSchoolBox" name="module" checked>未到校数据
									</label>
									<label class="checkbox-inline" for="module_6">
									  <input type="checkbox" id="module_6" value="workingTimeBox" name="module" checked>在岗时长数据
									</label>
					      	 	</div>
				      		</div>
				      </div>
				      <div class="modal-footer">
				        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
				        <button type="button" class="btn btn-primary btn-save-confing">保存</button>
				      </div>
				    </div><!-- /.modal-content -->
				    </form>
				  </div><!-- /.modal-dialog -->
				</div><!-- /.modal -->
			</div>
			<!--布局配置eee-->
			<div class="row" id="layoutContainer">				
			<!--app面板sss 迟到数据-->
				<div class="col-sm-6 col-xs-12" id="beLateBox">
					<div class="portlet box default">
			            <div class="portlet-title">
			                <div class="caption">
			                    <i class="glyphicon glyphicon-signal"></i>今天迟到数据
			                </div>
			                <div class="tools">
			                    <a href="javascript:;" class="collapse"></a>
			                    <!--<a href="#portlet-config" data-toggle="modal" class="config"></a>-->
			                    <a href="javascript:;" class="reload"></a>
			                    <a href="javascript:;" class="remove"></a>
			                </div>
			            </div>
						<!--app面板主要内容容器sss-->
			            <div class="portlet-body" style="display: block;">
							<div class="row">
					    		<div class="col-sm-4 col-xs-12">
					    			<div class="echartBox" id="beLate">
					    				<div class="proportion numbox parentClear">
					    					<h3 class="text-center h4-count">迟到比例</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">9</span>
					    						%
					    					</h1>
					    					
					    					<h3 class="glyphicon glyphicon glyphicon-arrow-down rf state-type" data-state="0"></h3>
					    				</div>
					    				<div class="proportion-num numbox">
					    					<h3 class="text-center h4-count">迟到人数</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">9</span>
					    					</h1>
					    					
					    					
					    				</div>
					    				<div class="proportion-total numbox">
					    					<h3 class="text-center h4-count">全校人数</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">0</span>
					    					</h1>
					    					
					    				</div>
					    			</div>
					    		</div>
					    		<div class="col-sm-8 col-xs-12">
					    			<div class="tableBox">
					    				<table class="table table-bordered table-hover table-striped table-vertical">
											<thead>
												<tr class="text-c">													
													<th>姓名</th>
													<th>科组</th>				
													<th>打卡时间</th>
													<th>课表</th>
												</tr>
												
											</thead>
											<tbody>
																																		
											</tbody>
										</table>
					    			</div>
					    			
					    		</div>
					    	</div>
					    	<div class="row btnBox mt-10">
					    		<div class="col-sm-12 col-xs-12 text-c">
					    			<div class="btn-group">
					    				<button type="button" class="btn btn-default active btn-onNode">
					    					第
					    					<b class="nodeLabel">n</b>
					    					节课
					    				</button>
					    				<button type="button" class="btn btn-default btn-onDay">当日</button>
					    			</div>
					    		</div>
					    	</div>
			            </div>
						<!--app面板主要内容容器eee-->
			        </div>
				</div>
				<!--app面板eee 迟到数据-->
				
				<!--app面板sss 早退数据-->
				<div class="col-sm-6 col-xs-12" id="leaveEarlyBox">
					<div class="portlet box default">
			            <div class="portlet-title">
			                <div class="caption">
			                    <i class="glyphicon glyphicon-signal"></i>昨天早退数据</div>
			                <div class="tools">
			                    <a href="javascript:;" class="collapse"></a>
			                    <!--<a href="#portlet-config" data-toggle="modal" class="config"></a>-->
			                    <a href="javascript:;" class="reload"></a>
			                    <a href="javascript:;" class="remove"></a>
			                </div>
			            </div>
						<!--app面板主要内容容器sss-->
			            <div class="portlet-body" style="display: block;">
							<div class="row">
					    		<div class="col-sm-4 col-xs-12">
					    			<div class="echartBox" id="leaveEarly">
					    				<div class="proportion numbox parentClear">
					    					<h3 class="text-center h4-count">早退比例</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">5</span>
					    						%
					    					</h1>
					    					
					    					<h3 class="glyphicon glyphicon glyphicon-arrow-up rf state-type" data-state="1"></h3>
					    				</div>
					    				<div class="proportion-num numbox">
					    					<h3 class="text-center h4-count">早退人数</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">5</span>
					    					</h1>
					    					
					    					
					    				</div>
					    				<div class="proportion-total numbox">
					    					<h3 class="text-center h4-count">全校人数</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">0</span>
					    					</h1>
					    					
					    				</div>
					    			</div>
					    		</div>
					    		<div class="col-sm-8 col-xs-12">
					    			<div class="tableBox">
					    				<table class="table table-bordered table-hover table-striped table-vertical">
											<thead>
												<tr class="text-c">													
													<th>姓名</th>
													<th>科组</th>				
													<th>打卡离开时间</th>
													<th>课表</th>
												</tr>
												
											</thead>
											<tbody>
																																		
											</tbody>
										</table>
					    			</div>
					    			
					    		</div>
					    	</div>
					    	<div class="row btnBox mt-10">
					    		<div class="col-sm-12 col-xs-12 text-c">
					    			<div class="btn-group" style="visibility: hidden;">
					    				<button type="button" class="btn btn-default active btn-onNode">
					    					第
					    					<b class="nodeLabel">n</b>
					    					节课
					    				</button>
					    				<button type="button" class="btn btn-default btn-onDay">昨日</button>
					    			</div>
					    		</div>
					    	</div>
			            </div>
						<!--app面板主要内容容器eee-->
			        </div>
				</div>
				<!--app面板eee 早退数据-->
				
				<!--app面板sss 旷工数据-->
				<div class="col-sm-6 col-xs-12" id="absenteeismBox">
					<div class="portlet box default">
			            <div class="portlet-title">
			                <div class="caption">
			                    <i class="glyphicon glyphicon-signal"></i>昨天旷工数据</div>
			                <div class="tools">
			                    <a href="javascript:;" class="collapse"></a>
			                    <!--<a href="#portlet-config" data-toggle="modal" class="config"></a>-->
			                    <a href="javascript:;" class="reload"></a>
			                    <a href="javascript:;" class="remove"></a>
			                </div>
			            </div>
						<!--app面板主要内容容器sss-->
			            <div class="portlet-body" style="display: block;">
							<div class="row">
					    		<div class="col-sm-4 col-xs-12">
					    			<div class="echartBox" id="absenteeism">
					    				<div class="proportion numbox parentClear">
					    					<h3 class="text-center h4-count">旷工比例</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">0</span>
					    						%
					    					</h1>
					    					
					    					<h3 class="glyphicon glyphicon glyphicon-arrow-up rf state-type" data-state="1"></h3>
					    				</div>
					    				<div class="proportion-num numbox">
					    					<h3 class="text-center h4-count">旷工人数</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">0</span>
					    					</h1>
					    				
					    					
					    				</div>
					    				<div class="proportion-total numbox">
					    					<h3 class="text-center h4-count">全校人数</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">0</span>
					    					</h1>
					    					
					    				</div>
					    			</div>
					    		</div>
					    		<div class="col-sm-8 col-xs-12">
					    			<div class="tableBox">
					    				<table class="table table-bordered table-hover table-striped table-vertical">
											<thead>
												<tr class="text-c">													
													<th>姓名</th>
													<th>科组</th>	
													<th>日期</th>
													<th>课表</th>
													
												</tr>
												
											</thead>
											<tbody>
																																		
											</tbody>
										</table>
					    			</div>
					    			
					    		</div>
					    	</div>
					    	<div class="row btnBox mt-10">
					    		<div class="col-sm-12 col-xs-12 text-c">
					    			<div class="btn-group" style="visibility: hidden;">
					    				<button type="button" class="btn btn-default active btn-onNode">
					    					第
					    					<b class="nodeLabel">n</b>
					    					节课
					    				</button>
					    				<button type="button" class="btn btn-default btn-onDay">昨日</button>
					    			</div>
					    		</div>
					    	</div>
			            </div>
						<!--app面板主要内容容器eee-->
			        </div>
				</div>
				<!--app面板eee 旷工数据-->
				
				<!--app面板sss 到校数据-->
				<div class="col-sm-6 col-xs-12" id="onSchoolBox">
					<div class="portlet box default">
			            <div class="portlet-title">
			                <div class="caption">
			                    <i class="glyphicon glyphicon-signal"></i>今天到校数据</div>
			                <div class="tools">
			                    <a href="javascript:;" class="collapse"></a>
			                    <!--<a href="#portlet-config" data-toggle="modal" class="config"></a>-->
			                    <a href="javascript:;" class="reload"></a>
			                    <a href="javascript:;" class="remove"></a>
			                </div>
			            </div>
						<!--app面板主要内容容器sss-->
			            <div class="portlet-body" style="display: block;">
							<div class="row">
					    		<div class="col-sm-4 col-xs-12">
					    			<div class="echartBox" id="onSchool">
					    				<div class="proportion numbox parentClear">
					    					<h3 class="text-center h4-count">到校比例</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">0</span>
					    						%
					    					</h1>
					    					
					    					<h3 class="glyphicon glyphicon glyphicon-arrow-up rf state-type" data-state="1"></h3>
					    				</div>
					    				<div class="proportion-num numbox">
					    					<h3 class="text-center h4-count">到校人数</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">0</span>
					    					</h1>
					    					
					    					
					    				</div>
					    				<div class="proportion-total numbox">
					    					<h3 class="text-center h4-count">全校人数</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">0</span>
					    					</h1>
					    					
					    				</div>
					    			</div>
					    		</div>
					    		<div class="col-sm-8 col-xs-12">
					    			<div class="tableBox">
					    				<table class="table table-bordered table-hover table-striped table-vertical">
											<thead>
												<tr class="text-c">													
													<th>姓名</th>
													<th>科组</th>				
													<th>打卡次数</th>
													<th>课表</th>
												</tr>
												
											</thead>
											<tbody>
																																		
											</tbody>
										</table>
					    			</div>
					    			
					    		</div>
					    	</div>
					    	<div class="row btnBox mt-10">
					    		<div class="col-sm-12 col-xs-12 text-c">
					    			<div class="btn-group" style="visibility: hidden;">					    				
					    				<button type="button" class="btn btn-default btn-onDay">当日</button>
					    			</div>
					    		</div>
					    	</div>
			            </div>
						<!--app面板主要内容容器eee-->
			        </div>
				</div>
				<!--app面板eee 到校数据-->
				
				<!--app面板sss 未到校数据-->
				<div class="col-sm-6 col-xs-12" id="noOnSchoolBox">
					<div class="portlet box default">
			            <div class="portlet-title">
			                <div class="caption">
			                    <i class="glyphicon glyphicon-signal"></i>今天未到校数据</div>
			                <div class="tools">
			                    <a href="javascript:;" class="collapse"></a>
			                    <!--<a href="#portlet-config" data-toggle="modal" class="config"></a>-->
			                    <a href="javascript:;" class="reload"></a>
			                    <a href="javascript:;" class="remove"></a>
			                </div>
			            </div>
						<!--app面板主要内容容器sss-->
			            <div class="portlet-body" style="display: block;">
							<div class="row">
					    		<div class="col-sm-4 col-xs-12">
					    			<div class="echartBox" id="noOnSchool">
					    				<div class="proportion numbox parentClear">
					    					<h3 class="text-center h4-count">未到校比例</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">0</span>
					    						%
					    					</h1>
					    					
					    					<h3 class="glyphicon glyphicon glyphicon-arrow-up rf state-type" data-state="1"></h3>
					    				</div>
					    				<div class="proportion-num numbox">
					    					<h3 class="text-center h4-count">未到校人数</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">0</span>
					    					</h1>
					    					
					    					
					    				</div>
					    				<div class="proportion-total numbox">
					    					<h3 class="text-center h4-count">全校人数</h3>
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">0</span>
					    					</h1>
					    					
					    				</div>
					    			</div>
					    		</div>
					    		<div class="col-sm-8 col-xs-12">
					    			<div class="tableBox">
					    				<table class="table table-bordered table-hover table-striped table-vertical">
											<thead>
												<tr class="text-c">													
													<th>姓名</th>
													<th>科组</th>	
													<th>课表</th>
													
												</tr>
												
											</thead>
											<tbody>
																																		
											</tbody>
										</table>
					    			</div>
					    			
					    		</div>
					    	</div>
					    	<div class="row btnBox mt-10">
					    		<div class="col-sm-12 col-xs-12 text-c">
					    			<div class="btn-group" style="visibility: hidden;">					    				
					    				<button type="button" class="btn btn-default btn-onDay">今天数据</button>
					    			</div>
					    		</div>
					    	</div>
			            </div>
						<!--app面板主要内容容器eee-->
			        </div>
				</div>
				<!--app面板eee 未到校数据-->
				
				
				<!--app面板sss 在岗时长数据-->
				<div class="col-sm-6 col-xs-12" id="workingTimeBox">
					<div class="portlet box default">
			            <div class="portlet-title">
			                <div class="caption">
			                    <i class="glyphicon glyphicon-signal"></i>本周在岗时长数据</div>
			                <div class="tools">
			                    <a href="javascript:;" class="collapse"></a>
			                    <!--<a href="#portlet-config" data-toggle="modal" class="config"></a>-->
			                    <a href="javascript:;" class="reload"></a>
			                    <a href="javascript:;" class="remove"></a>
			                </div>
			            </div>
						<!--app面板主要内容容器sss-->
			            <div class="portlet-body" style="display: block;">
							<div class="row">
					    		<!--<div class="col-sm-4 col-xs-12">
					    			<div class="echartBox" id="workingTime">
					    				<div class="proportion numbox parentClear">
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">0</span>
					    						%
					    					</h1>
					    					<h3 class="text-center h4-count">在岗时长比例</h3>
					    					<h3 class="glyphicon glyphicon glyphicon-arrow-up rf state-type" data-state="1"></h3>
					    				</div>
					    				<div class="proportion-num numbox">
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">0</span>
					    					</h1>
					    					<h3 class="text-center h4-count">在岗时长人数</h3>
					    					
					    				</div>
					    				<div class="proportion-total numbox">
					    					<h1 class="text-center h2-count">
					    						<span class="superCount">0</span>
					    					</h1>
					    					<h3 class="text-center h4-count">全校人数</h3>
					    				</div>
					    			</div>
					    		</div>-->
					    		<div class="col-sm-12 col-xs-12">
					    			<div class="tableBox">
					    				<table class="table table-bordered table-hover table-striped table-vertical">
											<thead>
												<tr class="text-c">													
													<th>姓名</th>
													<th>科组</th>	
													<th>本周在岗时长(小时)</th>
													<th>课表</th>
													
												</tr>
												
											</thead>
											<tbody>
												
											</tbody>
										</table>
					    			</div>
					    			
					    		</div>
					    	</div>
					    	<div class="row btnBox mt-10">
					    		<div class="col-sm-12 col-xs-12 text-c">
					    			<div class="btn-group" style="visibility: hidden;">
					    				<button type="button" class="btn btn-default btn-onDay">本周数据</button>
					    			</div>
					    		</div>
					    	</div>
			            </div>
						<!--app面板主要内容容器eee-->
			        </div>
				</div>
				<!--app面板eee 在岗时长数据-->
				
			</div>
		</div>
		
		

		<!--核心脚本sss-->
		<script src="../../lib/jquery/1.9.1/jquery.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/jquery-ui-1.10.1.custom.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../lib/layer/2.4/layer.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../lib/laypage/1.2/laypage.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../lib/bootstrap-3.3.7-dist/js/bootstrap.js" type="text/javascript" charset="utf-8"></script>
		<!--加密插件sss 必须放在jquery.myPlugIn_v1.0.js前面-->
		<script src="../../js/common/jsrsasign-all-min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/common/crypto-js.min.js" type="text/javascript" charset="utf-8"></script>
		<!--加密插件eee-->
		<!--已定义脚本库-->
		<script src="../../js/common/jquery.myPlugIn_v1.0.js" type="text/javascript" charset="utf-8"></script>
		<!--兼容ie低版本的本地存储插件-->
		<script src="../../js/jquery.cookie.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/common/localstorage-ie.js" type="text/javascript" charset="utf-8"></script>
		
		
		<!--[if lt IE 9]>
		<script src="../../js/excanvas.min.js"></script>
		<script src="../../js/respond.min.js"></script>  
		<![endif]-->
		<!--核心脚本eee-->
		<script src="../../js/app.js" type="text/javascript"></script>
		<!--计数特效sss-->
		<script src="../../lib/counterup/jquery.counterup.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../lib/counterup/waypoints.js" type="text/javascript" charset="utf-8"></script>
		<!--计数特效eee-->
		<!--表格插件ss-->
		<script src="../../lib/bootstrap-table/src/bootstrap-table.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../lib/bootstrap-table/src/locale/bootstrap-table-zh-CN.js" type="text/javascript" charset="utf-8"></script>
		<!--表格插件ee-->
		
		<!--<script src="../../lib/echarts/echarts.js" type="text/javascript" charset="utf-8"></script>
		<script src="data.js" type="text/javascript" charset="utf-8"></script>-->
		<script src="dashboard_2.0.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function(){
				App.init(); // initlayout和核心插件(公共部分)
				
				$.initPage();
				
				
			});
		
		</script>
	</body>

</html>